<template>
  <!-- 测试问卷发送 -->
  <u-dialog title="测试发送" :show.sync="show" width="1040px" :auto-close="false" :fullscreen="true" :footer="false" @cancel="cancel" @confirm="confirm">

    <el-form ref="dataForm" :rules="rules" :model="dataForm" label-width="100px">

      <el-form-item label="选择用户" prop="cardNo">
        <ues-member v-model="dataForm.cardNo" ></ues-member>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="confirm">测试发送</el-button>
      </el-form-item>

    </el-form>

  </u-dialog>
</template>

<script>
/**
 * 业务组件 - 测试问卷
 */
import uesMember from '@/components/member/uesMember'
export default {
  name: 'Test',
  components: {
    uesMember
  },
  model: {
    prop: 'show',
    event: 'changeShow'
  },
  props: {
    /** 是否弹框 */
    show: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      api: this.$u.api.PluginsQuestionnaireList,
      dataForm: {
        cardNo: ''
      },
      rules: {}
    }
  },
  watch: {
    show(newVal) {
      if (newVal) {
        const self = this
        self.$nextTick(() => {
          self.$refs['dataForm'].clearValidate()
        })
      }
    }
  },
  methods: {
    // 确认
    confirm() {
      const self = this
      self.$confirm('测试问卷发送，是否继续？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
        // 效验数据格式
        self.$refs['dataForm'].validate((valid) => {
          if (valid) {
            // 提交更新数据
            self.api.test(self.dataForm).then(() => {
              // 通知信息
              self.$u.msg('发送成功')
              // 双向绑定数据
              self.$emit('changeShow', false)
              // 更新成功后传递
              self.$emit('change')
            })
          }
        })
      }).catch(() => {
      })

      self.$emit('confirm')
    },
    // 关闭或者取消
    cancel() {
      this.$emit('changeShow', false)
      this.$emit('cancel')
    }
  }
}
</script>
<style lang="scss" scoped>

.panel{
  margin-bottom: 20px;
  .panel-body{
    display:flex;
    justify-content:space-between;

    .panel-header{
      display: flex;
      flex-flow: column;
      color: #999;
      font-size: 12px;

      h4{
        font-size: 14px;
        color: #000;
      }
    }

    .panel-switch{
      margin-top: 20px;
    }
  }
}

</style>
